import React, { Component } from 'react';
import {withRouter} from 'react-router-dom'

 class Header extends Component {

    goForward = ()=>{
        this.props.history.goForward();
    }
    goBack = ()=>{
        this.props.history.goBack();
    }
    go = ()=>{
        this.props.history.go(2);
    }

    render() {
        return (
            <div className="col-xs-offset-2 col-xs-8">
                <div className="page-header"><h2>React Router Demo</h2></div>
                <button onClick={this.goForward}>前进</button>
                &nbsp;<button onClick={this.goBack}>后退</button>
                &nbsp;<button onClick={this.go}>前进+2</button>
            </div>
        )
    }
}

export default withRouter(Header)
// withRoute 是react-router-dom 中对外暴露的一个函数
// 其作用是将一般组件进行加工，使其具备路由组件特有的API（其实主要就是history,location,match三大属性嘛）
// withRouter的返回值是一个包装后的新组件